# Vue
Sejam bem vindos ao paper de Vue da He4rt Developers, aqui nós iremos dar uma introdução ao framework Vue, mostrando todo o seu conceito e mostrando como utilizar de maneira efetiva.
O Vue(se pronuncia view) é um framework para a construção de sites de forma progressiva, sendo diferente de outros tipo de estrutura monolítica. O ecossistema do Vue é extenso possibilitando ao desenvolvedor construir aplicações Frontend Web.
# Comunidade
A comunidade do Vue vem crescendo cada vez mais, iremos estar disponibilizando alguns links da comunidade para auxiliar seu estudo sobre a framework.
# SPA(Single Page Aplication)
Significa que no Vue teremos uma aplicação web completa acontecendo em uma única página sem a necessidade de recarregar a página. O Vue também possui SSR(Server Side Render) com o Nuxt e aplicações PWA com o Quasar, mas neste início vamos focar apenas no SPA e apresentar alternativas futuramente.
Utilizando este conceito conseguimos construir aplicações frontend de forma robusta e escalável.
# Virtual DOM
Virtual DOM é um framework para manipulação do DOM(Document Object Model) que é utilizado pelo Vue, ele faz uma representação do DOM real na linguagem JavaScript, ou seja, o DOM verdadeiro é gerado a partir do DOM Virtual.Por conta disso, o Vue utiliza o vue-loader para fazer todo o ciclo do Virtual DOM e conseguir transformar no DOM final.
# VueLoader
O vue-loader irá analisar o arquivo, pegar cada bloco de linguagem e montá-lo de volta em um módulo CommonJs cujo module.exports seja um objeto de opções do componente Vue.js.
Para manipular, o Vue utiliza um sistema de componentes com a extensão .vue. O arquivo é um formato de arquivo personalizado que usa a sintaxe parecido com o HTML para descrever um componente Vue. Cada arquivo é dividido em três partes: <template>, <script>, <style>
.
<template>
<div class="exemplo">He4rt Developers</div>
</template>
<script>
export default {
...
}
</script>
<style>
.exemplo {
color: purple;
}
</style>